<template>
	<el-dialog :title="title" :visible.sync="isShow" :close-on-click-modal="false" :before-close="close" width="900px">
		<div class="form-box">
			<el-form ref="form" :model="form" :rules="rules" label-width="140px">
				<el-row>
					<el-col :span="24">
						<el-form-item label="分账规则类型" prop="ruleType">
							<el-input :value="form.ruleType == 'global' ? '全局规则' : ''" readonly v-if="isEdit"></el-input>
							
							<el-radio-group v-model="form.ruleType" v-else>
								<el-radio :label="'global'">全局规则</el-radio>
							</el-radio-group>
						</el-form-item>
					</el-col>
				</el-row>
				
				<el-row>
					<el-col :span="24">
						<el-form-item label="平台分账比例" prop="platformRate">
							<el-input type="number" v-model="form.platformRate" placeholder="请填写数字，单位‱。例如填写5即表示万分之五"></el-input>
						</el-form-item>
					</el-col>
				</el-row>
				
				<el-row>
					<el-col :span="24">
						<el-form-item label="基金会分账比例" prop="foundationRate">
							<el-input type="number" v-model="form.foundationRate" placeholder="请填写数字，单位‱。例如填写5即表示万分之五"></el-input>
						</el-form-item>
					</el-col>
				</el-row>
				
				<el-row>
					<el-col :span="24">
						<el-form-item label="加盟商家分账比例" prop="shopRate">
							<el-input type="number" v-model="form.shopRate" placeholder="请填写数字，单位‱。例如填写5即表示万分之五"></el-input>
						</el-form-item>
					</el-col>
				</el-row>
				
				<el-row>
					<el-col :span="24">
						<el-form-item label="供应商分账比例" prop="supplierRate">
							<el-input type="number" v-model="form.supplierRate" placeholder="请填写数字，单位‱。例如填写5即表示万分之五"></el-input>
						</el-form-item>
					</el-col>
				</el-row>
			</el-form>
		</div>
		
		<div slot="footer">
			<el-button type="primary" @click="submit">保 存</el-button>
			<el-button @click="reset" v-if="!isEdit">重 置</el-button>
			<el-button @click="close">取 消</el-button>
		</div>
	</el-dialog>
</template>

<script>
	import { addRule, editRule } from '@api/profitAllocation/profitAllocation'
	export default {
		props: {
			isShow: Boolean,
			id: Number,
			item: Object,
			isEdit: Boolean,
		},
		data() {
			return {
				form: {
					ruleType: 'global',
					platformRate: '',
					shopRate: '',
					supplierRate: '',
					foundationRate: '',
				},
				rules: {
					ruleType: [{ required: true, message: '请选择规则的类型', trigger: 'blur' }],
					platformRate: [{ required: true, message: '请填写平台分账比例', trigger: 'blur' }],
					shopRate: [{ required: true, message: '请填写加盟商家分账比例', trigger: 'blur' }],
					supplierRate: [{ required: true, message: '请填写供应商分账比例', trigger: 'blur' }],
					foundationRate: [{ required: true, message: '请填写基金会分账比例', trigger: 'blur' }],
				}
			}
		},
		computed: {
			title() {
				let title = '分账规则';
				if(this.isEdit) {
					title = '编辑' + title;
				} else {
					title = '添加' + title;
				}
				return title;
			}
		},
		watch: {
			isShow(val) {
				if(val) {
					if(this.isEdit) {
						this.initForm();
					}
				}
			},
		},
		methods: {
			initForm() {
				this.form.ruleType = this.item.ruleType;
				this.form.platformRate = this.item.platformRate;
				this.form.shopRate = this.item.shopRate;
				this.form.supplierRate = this.item.supplierRate;
				this.form.foundationRate = this.item.foundationRate;
			},
			
			submit() { //提交添加or编辑
				this.$refs.form.validate(valid => {
					if (valid) {
						let params = {
							ruleType: this.form.ruleType,
							platformRate: this.form.platformRate,
							shopRate: this.form.shopRate,
							supplierRate: this.form.supplierRate,
							foundationRate: this.form.foundationRate,
						}
						
						if(this.isEdit) {
							params.id = this.id;
							
							editRule(params)
								.then(() => {
									this.$message.success('规则修改成功！');
									this.close();
									
									this.$emit('submit');
								})
						} else {
							addRule(params)
								.then(() => {
									this.$message.success('规则添加成功！');
									this.close();
									
									this.$emit('submit');
								})
						}
					}
				})
			},
			reset() {
				this.form.ruleType = 'global';
				this.form.platformRate = '';
				this.form.shopRate = '';
				this.form.supplierRate = '';
				this.form.foundationRate = '';
			},
			
			close() {
				this.$emit('close');
				this.reset();
			},
		}
	}
</script>

<style>
</style>